<template>
  <div class="nav_outer">
    <Header>意见反馈</Header>
    <div class="content" @click="change=false">
      <div class="consultant">
        <div class="avawrap">
          <img :src="consult.photo || defauava" alt />
        </div>
        <p class="name">意见反馈</p>
        <textarea name id cols="30" rows="6" placeholder="请输入" v-model="reason"></textarea>
          <div class="mjbtn sure" style="margin-top:0;" @click="sendPerson">提交</div>
      </div>
    </div>
  </div>
</template>

<script>
import Header from "@/components/commonComponents/Header";
export default {
  data() {
    return {
      change: false,
      reason: "",
      consult: {},
      defauava: require('../assets/img/man@2x.png')
    };
  },
  created() {
  },
  methods: {
    sendPerson() {
      if(!this.reason){
          this.$toast('请输入');
          return
      }
      this.$toast('提交成功');
      this.$router.back();
    },
  },
  components: {
    Header
  }
};
</script>

<style lang='scss' scoped>
@function px2em($px) {
  @if (unitless($px)) {
    @return px2em($px + 0px);
  } @else if (unit($px) == em) {
    @return $px;
  }
  @return ($px / 75px) * 1rem;
}
body {
  background: #f5f5f5 !important;
}
.content {
  text-align: center;
  .consultant {
    background: #fff;
    border-radius: 10px;
    margin: px2em(210) auto 0;
    width: px2em(600);
    padding: 0  px2em(20) px2em(72);
    box-shadow: 0 0 20px #ddd;
    position: relative;
  }
  .name {
    font-size: 1.2em;
    font-weight: bold;
    color: #303030;
  }
  .info {
    height: px2em(140);
    line-height: px2em(140);
    margin: 0 px2em(100);
    color: #9a9a9a;
    > img {
      width: px2em(32);
      vertical-align: middle;
      margin-left: 2px;
    }
  }
  .avawrap {
    width: px2em(168);
    height: px2em(168);
    position: relative;
    top: - px2em(84);
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto;
    > img {
      width: 100%;
    }
  }
  .change,
  .sure {
    height: px2em(76);
    line-height: px2em(76);
    border-radius: px2em(38);
    margin: px2em(72) px2em(90) 0;
    background: #5fa4ff;
  }
  .changebox {
    position: absolute;
    color: #858585;
    top: px2em(260);
    left: - px2em(23);
    width: px2em(586);
    box-sizing: border-box;
    padding: px2em(26);
    background: #fff;
    border-radius: 5px;
    > textarea {
      border: 1px solid #ccc;
      width: 100%;
      font-size: 14px;
    }
  }
}
</style>
